<!DOCTYPE html>
<html lang="zh-cn" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head th:th:fragment="head">
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
	<link  href="resources/css/bootstrap.min.css" th:href="@{/resources/css/bootstrap.min.css}" rel="stylesheet" type="text/css" />
	<link  href="resources/css/bootstrap-theme.min.css" th:href="@{/resources/css/bootstrap-theme.min.css}" rel="stylesheet" type="text/css" />
    <!--[if lt IE 9]>
    <script src="resources/js/html5shiv.js" th:src="@{/resources/js/html5shiv.js}" type="text/javascript"></script>
    <script src="resources/js/respond.min.js" th:src="@{/resources/js/respond.min.js}" type="text/javascript"></script>
    <![endif]-->
    <script src="resources/js/jquery-2.1.0.min.js" th:src="@{/resources/js/jquery-1.11.0.min.js}" type="text/javascript"></script>
    <script src="resources/js/bootstrap.min.js" th:src="@{/resources/js/bootstrap.min.js}" type="text/javascript"></script>
    
    <style type="text/css">
	    @-webkit-viewport   { width: device-width; }
		@-moz-viewport      { width: device-width; }
		@-ms-viewport       { width: device-width; }
		@-o-viewport        { width: device-width; }
		@viewport           { width: device-width; }
    	body {
		  padding-top: 50px;
		}
		
		.sub-header {
		  padding-bottom: 10px;
		  border-bottom: 1px solid #eee;
		}
		
		.sidebar {
		  display: none;
		}
		@media (min-width: 768px) {
		  .sidebar {
		    position: fixed;
		    top: 51px;
		    bottom: 0;
		    left: 0;
		    z-index: 1000;
		    display: block;
		    padding: 20px;
		    overflow-x: hidden;
		    overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
		    background-color: #f5f5f5;
		    border-right: 1px solid #eee;
		  }
		}
		
		.nav-sidebar {
		  margin-right: -21px; /* 20px padding + 1px border */
		  margin-bottom: 20px;
		  margin-left: -20px;
		}
		.nav-sidebar > li > a {
		  padding-right: 20px;
		  padding-left: 20px;
		}
		.nav-sidebar > .active > a {
		  color: #ffffff;
		  background-color: #428bca;
		}
		.nav-sidebar > .active > a:hover {
		  color: #000000;
		  font-weight: bolder;
		}
		
		.main {
		  padding: 20px;
		}
		@media (min-width: 768px) {
		  .main {
		    padding-right: 40px;
		    padding-left: 40px;
		  }
		}
		.main .page-header {
		  margin-top: 0;
		}
		
		.placeholders {
		  margin-bottom: 30px;
		  text-align: center;
		}
		.placeholders h4 {
		  margin-bottom: 0;
		}
		.placeholder {
		  margin-bottom: 20px;
		}
		.placeholder img {
		  display: inline-block;
		  border-radius: 50%;
		}
    </style>
    <script type="text/javascript">
    	$(function(){
    		if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
    			  var msViewportStyle = document.createElement("style")
    			  msViewportStyle.appendChild(
    			    document.createTextNode(
    			      "@-ms-viewport{width:auto!important}"
    			    )
    			  )
    			  document.getElementsByTagName("head")[0].appendChild(msViewportStyle)
    			}
    	})
    	//左边当前菜单高亮
    	function activeLeftNav(rescode){
    		$("div#leftNav ul li[rescode='"+rescode+"']").addClass("active");
    	}
    </script>
</head>
<body>
	<div th:fragment="top" class="navbar navbar-default navbar-fixed-top" role="navigation">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#" th:href="@{/}" ><strong>权限管理系统</strong></a>
        </div>
        <div class="navbar-collapse collapse">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="#" th:href="@{'/user/viewInfo/'+${#authentication.principal.id}}">个人资料</a></li>
            <li><a href="#" th:href="@{/user/modMyPassWord}">修改密码</a></li>
            <li><a href="#" th:href="@{/logout}">退出系统</a></li>
          </ul>
          <!-- <form class="navbar-form navbar-right">
            <input type="text" class="form-control" placeholder="Search..." />
          </form> -->
        </div>
      </div>
    </div>
    
    <div th:fragment="left" id="leftNav" class="col-sm-3 col-md-2 sidebar">
         <ul class="nav nav-sidebar">
           <li rescode="index"><a th:href="@{/}"  href="#">主页</a></li>
           <li rescode="usermanage"><a th:href="@{/user/findUsers}" href="#">用户管理</a></li>
           <li><a href="#">Analytics</a></li>
           <li><a href="#">Export</a></li>
         </ul>
         <ul class="nav nav-sidebar">
           <li><a href="">Nav item</a></li>
           <li><a href="">Nav item again</a></li>
           <li><a href="">One more nav</a></li>
           <li><a href="">Another nav item</a></li>
           <li><a href="">More navigation</a></li>
         </ul>
         <ul class="nav nav-sidebar">
           <li><a href="">Nav item again</a></li>
           <li><a href="">One more nav</a></li>
           <li><a href="">Another nav item</a></li>
         </ul>
      </div>
       
</body>
</html>